import React, { Suspense } from 'react'
import ReactDOM from 'react-dom'
import { HashRouter } from 'react-router-dom'
import moment from 'moment'
import { Route, Switch } from 'react-router-dom'

import zhCN from 'antd/es/locale/zh_CN'
import { ConfigProvider } from 'antd'

import { configure } from 'mobx'
import { Provider } from 'mobx-react'

import App from './pages/App'
import Stores from './stores'
import Login from './pages/login/login'
import Registered from './pages/login/registered'

moment.locale('cn')
ReactDOM.render(
  <ConfigProvider locale={zhCN}>
    <Provider {...Stores}>
      <HashRouter>
        <Switch>
          <Route exact key='/login' path='/login'>
            <Login {...Stores} />
          </Route>
          <Route exact key='/reg' path='/reg'>
            <Registered {...Stores} />
          </Route>
          <Suspense
            fallback={
              <div style={{ textAlign: 'center' }}>
                <h1>loadding</h1>
              </div>
            }
          >
            <App />
          </Suspense>
        </Switch>
      </HashRouter>
    </Provider>
  </ConfigProvider>,
  document.getElementById('root')
)

//5.x版本严格模式开启方式
configure({
  enforceActions: 'observed',
})
